﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="apple-touch-fullscreen" content="yes">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
<!--    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">-->
    <meta name="format-detection" content="telephone=no">


    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0">
    <meta content="telephone=no" name="format-detection" />
    <meta name="apple-mobile-web-app-capable" content="yes" />

    <title>在线投诉系统</title>

    <link rel="stylesheet" type="text/css" href="assets/shop/complain/css/base.css">
    <link rel="stylesheet" type="text/css" href="assets/shop/complain/css/home.css">
    <link href="/assets/user/toast/Js/NZ-Plugin/Css/NZ-MsgBox.min.css" rel="stylesheet" />
    <style>
        .complain-history{
            color: #007bff;
            font-size: 13px;
        }
        .complain-history:hover{
            text-decoration: underline;
            color: #007bff;
        }
        @media (max-width: 900px){
            .aui-content-up{
                width: 100%;
                padding: 10px;
            }
            .aui-btn-default{
                width: 100%;
            }
            #zw{
                display: none;
            }
            .aui-form-input{
                width: calc(100% - 90px);
            }
            body{
                min-width: 100%;
            }

        }
    </style>
</head>
<body>
    <section class="aui-content">
        <div style="height:20px;" id="zw"></div>
        <div class="aui-content-up">
            <form action="" name="form1" method="post">
                <div class="aui-content-up-form">
                    <h2>
                        在线投诉系统
                        <span style="float: right;"><a href="{:url('/complain-list')}" class="complain-history">投诉历史</a></span>
                    </h2>
                </div>
                <div class="aui-form-group clear">
                    <label class="aui-label-control">
                        您的称呼 <em>*</em>
                    </label>
                    <div class="aui-form-input">
                        <input type="text" class="aui-form-control-two" name="name" id="name" placeholder="我们将与您取得联系" value="{$complain.name|default=''}">
                    </div>
                </div>
                <div class="aui-form-group clear">
                    <label class="aui-label-control">
                        联系QQ <em>*</em>
                    </label>
                    <div class="aui-form-input">
                        <input type="text" class="aui-form-control-two" name="qq" id="qq" placeholder="请输入您的联系QQ" value="{$complain.qq|default=''}" />
                    </div>
                </div>
                <div class="aui-form-group clear">
                    <label class="aui-label-control">
                        订单号 <em>*</em>
                    </label>
                    <div class="aui-form-input">
                        <input type="text" class="aui-form-control-two" name="out_trade_no" id="out-trade-no" placeholder="您购买商品的订单号" value="{$complain.out_trade_no|default=''}" />
                    </div>
                </div>
                <div class="aui-form-group clear">
                    <label class="aui-label-control">
                        投诉内容 <em>*</em>
                    </label>
                    <div class="aui-form-input">
                        <textarea class="aui-form-control" name="details" id="details" placeholder="请详细说明您的投诉内容">{$complain.details|default=''}</textarea>
                    </div>
                </div>
                <div class="aui-form-group-text">
                    <p>我们将在一个工作日内与您取得联系，请注意关注您联系方式的通知信息。</p>
                </div>
                {if condition="!$complain"}
                <button class="submit" style="display: none;">提交投诉</button>
                {/if}
            </form>
        </div>
        {if condition="!$complain"}
        <div class="aui-btn-default">
            <button class="aui-btn aui-btn-account submit-btn">提交投诉</button>
        </div>
        {/if}
        {if condition="$complain"}
        <div class="aui-btn-default" style="padding: 10px 24px 20px 24px">


            <div class="aui-form-group clear">
                <label class="aui-label-control">
                    处理结果
                </label>
                <div class="aui-form-input">
                    <textarea class="aui-form-control" name="details" id="" placeholder="" disabled>{$complain.handle_result}</textarea>
                </div>
            </div>
        </div>
        <div class="aui-btn-default">
            <a href="{:url('/complain')}" class="aui-btn aui-btn-account">继续投诉</a>
        </div>
        {/if}
    </section>

    <script src="/assets/libs/jquery/dist/jquery.min.js"></script>
    <script src="/assets/user/toast/Js/NZ-Plugin/Js/NZ-MsgBox.min.js"></script>
    <script src="/assets/user/toast/Js/NZ-Plugin/Js/NZ-Drag.min.js"></script>

    <script type="text/javascript">

        $('.submit-btn').click(function(){
            $('.submit').click();
        })

        $( ".submit" ).on( "click", function(event) {
            event.preventDefault();
            var mydata = $("form").serialize();
            $.ajax({
                type: "POST",
                dataType: "json",
                url: event.target.formAction,
                data: mydata,
                success: function(e) {
                    if(e.code == 200){
                        location.href= "{:url('/complain')}?complain_id=" + e.data;
                    } else {
                        $.NZ_MsgBox.tipsbar({ content: e.msg, type: "error", showtime: 2500 });
                    }
                },
                error: function(xhr, textStatus, errorThrown) {
                    alert(textStatus);
                }
            });
        });


    </script>
</body>
</html>
